<template>
  <div class="app-container  course feedback schoolFeedBackDetail">
    <div class="edit-title-line edit-title-line-unset-margin-top" >反馈列表</div>
    <div class="feedback-list">
      <div class="feedback-list-item">
        <div class="feedback-list-item-msg">
          <div>
            <div class="ele-form-item">
              <div class="ele-form-label">标题：</div>
              <div class="ele-form-content">{{feedbackDetail.title || null}}</div>
            </div>

            <div class="ele-form-item">
              <div class="ele-form-label">反馈人：</div>
              <div class="ele-form-content">{{feedbackDetail.createByName}}</div>
            </div>

            <div class="ele-form-item">
              <div class="ele-form-label">反馈给谁：</div>
              <div class="ele-form-content" :title="feedbackDetail.fbToUserIdString" >{{formatFbPerson(feedbackDetail.fbToUserIdString)}}</div>
            </div>

            <div class="ele-form-item">
              <div class="ele-form-label">反馈时间：</div>
              <div class="ele-form-content">{{feedbackDetail.createAt | dataFormat}}</div>
            </div>
          </div>
          <div class="feedback-list-item-operating" v-show="userInfo.id == feedbackDetail.createBy">
            <template v-if="permissions.indexOf('pl:comment:operating') !== -1">
              <span class="feedback-list-item-operating-edit"  @click="$router.push({path: '/schoolFeedBack/edit', query: {feedBackId: feedbackDetail.id}})">编辑</span>
              <span class="feedback-list-item-operating-delete" @click="handleClickDelete(feedbackDetail.id)">删除</span>
            </template>
          </div>
        </div>
        <div class="association-lesson">
          <div class="association-lesson-label" style="width: 82px;text-align: left">关联标题：</div>
         <template v-if="!showMoreLesson">
           <div class="association-lesson-content">
             {{ this.feedbackDetail.lessonName}}
           </div>
         </template>
          <template v-else>
           <template v-if="lessonTitleMore">
             <div class="association-lesson-content">
               {{ this.feedbackDetail.lessonName}}
               <span @click="lessonTitleMore = !lessonTitleMore" style="color:#02b2b5; margin-left: 20px;cursor: pointer">更多</span>
             </div>

           </template>

            <template v-else>
              <div class="association-lesson-content">
                {{ this.feedbackDetail.lessonNameMore}}
                <span @click="lessonTitleMore = !lessonTitleMore" style="color:#02b2b5; margin-left: 20px;cursor: pointer">收起</span>
              </div>
            </template>

          </template>
        </div>
        <div class="edit-title-line">整体情况文本</div>
        <div v-html="feedbackDetail.overallSituation"></div>
        <div class="edit-title-line">整改建议文本</div>
        <div v-html="feedbackDetail.repairSuggession"></div>
      </div>
    </div>
    <el-confirm-dialog
      elTip="确定要删除该条反馈吗？"
      :showDialog="cancelConfirm"
      :confirmSubmit="elConfirmDialogSubmit"
      :confirmCancel="elConfirmDialogCancel"
      @closeDialog = "elConfirmDialogClose"
    >
    </el-confirm-dialog>
  </div>
</template>

<script>
  import ElConfirmDialog from '@/components/ElConfirmDialog/index.vue'
  import {getPersonalFeedbackList, getFeedbackDetail, getLessonListByAuthor, getLessonListByLessonIds, getStaffList, deleteFeedback} from '@/api/api.js'
  import {mapGetters} from 'vuex'
  export default {
        name: "schoolFeedbackDetail",
        components: {
          ElConfirmDialog
        },
      computed: {
        ...mapGetters([
          'permissions','userInfo'
        ]),
      },
        data() {
          return {
            toFeedBackList : [],
            //点击删除，显示询问框
            cancelConfirm: false,
            //当前点击的删除按钮
            currentDeleteId: '',
            showMoreLesson : false,
            lessonTitleMore : true,
            faceBackList: [],
            pageInfo: {
              pageNum: 1,
              pageSize: 2,
              total: 0
            },
            feedbackDetail: {
              id: '',
              title : '',
              semesterId : '',
              schoolYear: '',
              term : '',
              subjectName : '',
              createByName: '',
              gradeName: '',
              createAt : '',
              lessonName: '',
              overallSituation: '',
              repairSuggession : '',
              lessonNameMore : ''
            }
          }
        },
        methods: {
          /**分页开始**/
          handleSizeChange(val) {
            this.pageInfo.pageSize = val
            this.fetchData()
          },
          handleCurrentChange(val) {
            this.pageInfo.pageNum = val
            this.fetchData()
          },
          /**分页结束**/
          //反馈给谁人数超过2人显示……
          formatFbPerson(nameList) {
            if (nameList) {
              nameList = nameList.split(",")
            }
            if(nameList instanceof  Array) {
              if(nameList.length <= 2) {
                return nameList.join(", ")
              } else {
                return `${nameList[0]}, ${nameList[1]}……`
              }
            }
            return nameList;
          },
          /** 取消询问框相关**/
          elConfirmDialogSubmit() {

            let params = {
              feedbackId: this.feedbackDetail.id
            }
            deleteFeedback(params).then(res => {
              if (res.code === 200) {
                this.cancelConfirm = false
                this.$alert("删除成功！", "提示", {
                  type : "success",
                  callback : () => {
                    this.$router.replace({ path: '/schoolFeedBack/list'})
                  }
                })
              } else {
                this.$alert("删除成功！" + res.message, "错误", {type : "error"})
              }

            })
          },
          elConfirmDialogCancel() {
            this.cancelConfirm = false
          },
          elConfirmDialogClose() {
            this.cancelConfirm = false
          },
          /** 取消询问框相关结束 **/
          /*** 初始化 ***/
          initStaffList() {
            this.toFeedBackList = []
            getStaffList().then(res => {
              if (res.code === 200) {
                if (res.result && res.result.length && res.result.length > 0) {
                  this.toFeedBackList = res.result;
                } else {
                  this.$alert('学校还未维护教职工信息，请进行初始化！', '提示', {
                    confirmButtonText: '我知道了',
                  });
                }
              } else {
                this.$alert("获取年级选项列表失败！" + res.message, "错误", {type : "error"})
              }
            })
          },
          getLessonListByAuthor() {
            if (!this.feedbackDetail.lessonString) {
              return
            }
            let params = {
              lessIdString : this.feedbackDetail.lessonString
            }
            getLessonListByLessonIds(params).then(res => {
              if (res.code == 200) {
                this.associationCourseList = (res.result && Array.isArray(res.result)) ? res.result : []
                let lessonIdString  = this.feedbackDetail.lessonString
                let lessonIdArr = lessonIdString.split(",")
                let lessonNameArr = []
                if ( this.associationCourseList.length > 0) {
                  for (let lessonId of lessonIdArr) {
                    for (let lesson of this.associationCourseList ) {
                      if (lessonId == lesson.id) {
                        lessonNameArr.push(lesson.title)
                      }
                    }
                  }
                  if (lessonNameArr.length > 0) {

                    if (lessonNameArr.length > 2) {
                      this.feedbackDetail.lessonName = `${lessonNameArr[0]},${lessonNameArr[1]}`
                      this.feedbackDetail.lessonNameMore = lessonNameArr.join(",")
                      this.showMoreLesson = true
                    } else {
                      this.showMoreLesson = false
                      this.feedbackDetail.lessonName = lessonNameArr.join(",")
                      this.feedbackDetail.lessonNameMore = lessonNameArr.join(",")
                    }
                  }
                }
              } else {
                this.$alert("获取关联备课失败！" + res.message, "错误", {type : "error"})
              }
            })
          },

          /*** 初始化结束 ***/
          handleClickDelete() {
            this.cancelConfirm = true
          },
          initPersonFeedbackList () {
            getPersonalFeedbackList({}).then(res => {
              if (res.code == 200) {
                this.faceBackList = (res.result && Array.isArray(res.result.list)) ? res.result.list : []
                this.pageInfo.total = res.result.total || 0

              } else {
                this.$alert("获取个人反馈失败！" + res.message, "错误", {type : "error"})
              }

            })
          },
          initSchoolFeedBackById(feedbackId) {
            let params = {
              feedbackId
            }
            getFeedbackDetail(params).then(res => {
              if (res.code == 200) {
                this.feedbackDetail.id = res.result.id
                this.feedbackDetail.createBy = res.result.createBy
                this.feedbackDetail.title = res.result.title
                this.feedbackDetail.schoolYear = res.result.schoolYear
                this.feedbackDetail.term = res.result.term
                this.feedbackDetail.semesterId = res.result.semesterId
                this.feedbackDetail.subjectName = res.result.subjectName
                this.feedbackDetail.gradeName = res.result.gradeName
                this.feedbackDetail.createByName = res.result.createByName || null
                this.feedbackDetail.createAt = res.result.createAt
                this.feedbackDetail.fbToUserIdString = res.result.fbToUserNameString
                this.feedbackDetail.checkContent = res.result.checkContent
                this.feedbackDetail.lessonString = res.result.lessonString
                this.feedbackDetail.repairSuggession = res.result.repairSuggession
                this.feedbackDetail.overallSituation = res.result.overallSituation
                this.getLessonListByAuthor()
              } else {
                this.$alert("获取反馈详情失败！" + res.message, "错误", {type : "error"})
              }
            })
          },
        },
      created() {
        // this.initStaffList()
      },
      mounted () {
        let schoolFeedBackId = this.$route.query.id
        this.initSchoolFeedBackById(schoolFeedBackId)
      }
    }
</script>

<style scoped>

</style>
